<!DOCTYPE html >
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<link rel="stylesheet" href="./iconfont.css">
	</head>
	<script src="./js/iconfont.js"></script>
	<style type="text/css">
		p {
			margin: 0;
			padding: 0;
		}

		.icon {
			width: 1em;
			height: 1em;
			vertical-align: -0.15em;
			fill: currentcolor;
			overflow: hidden;
		}

		input {
			border-radius: 20px 20px;
			position: relative;
			left: 30px;
			top: 10px;
		}

		.bordertext {
			border-radius: 20px 20px;
			position: relative;
			left: 30px;
		}

		button {
			margin-top: 30px;
			border-radius: 20px 20px;
			background: #E9E9E9;
			outline: none;
			border: 1px solid 0.5px;
			position: relative;
			left: 80px;
		}

		.iconfont {
			font-family: "iconfont" !important;
			font-size: 16px;
			font-style: normal;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
		}

		@font-face {
			font-family: 'iconfont';
			src: url('iconfont.eot');
			src: url('iconfont.eot?#iefix') format('embedded-opentype'),
				url('iconfont.woff2') format('woff2'),
				url('iconfont.woff') format('woff'),
				url('iconfont.ttf') format('truetype'),
				url('iconfont.svg#iconfont') format('svg');
		}

		#weizhi {
			margin: 0 0;
			padding: 0 0;
			padding-right: 0;
			align-content: center;
		}

		.divlogin {
			width: 250px;
			height: 170px;
			margin-right: 0;
			border: #E9E9E9 solid 1px;
			border-radius: 10px 10px;
			position: relative;
			float: right;
			top: 50%;
			bottom: -200px;
			right: 50%;
		}
	</style>
	<body>
		<div>
			<form id="myForm">
				<div class="divlogin">
					<p style="font-family:华文宋体; position: relative ; left: 80px;color: #666666">用户登录</p>
					<hr color="#E9E9E9" />
					<svg class="icon" aria-hidden="true" style="left: 25px;position: relative;color: #666666;top: 10px; ">
						<use xlink:href="#icon-yonghu"></use>
					</svg>
					<input type="text" id="edtUserName" name="username" autocomplete="off" required="required" class="name"
					 placeholder="请输入用户名..." value=""><br /><br />
					<svg class="icon" aria-hidden="true" style="color: #666666;position: relative;left: 25px;top: 10px;">
						<use xlink:href="#icon-mima"></use>
					</svg>
					<input type="password" id="edtUserPassword" name="password" placeholder="请输入密码......" class="password" />
					<br />
					<button type="submit">登录</button>
					<button><a href="registUser.html" style="text-decoration: none">注册</a></button>
				</div>
			</form>
		</div>
	</body>
	<script type="text/javascript" src="jquery-1.11.2.min.js"></script>
	<script type="text/javascript" src="jquery-form.js"></script>
	<script type="text/javascript" src="jQuery.md5.js"></script>
	<script type="text/javascript">
		$(function() {
			$('#myForm').ajaxForm({
				url: "http://localhost:63342/WWW/lr3181/Login.php",
				type: 'post',
				data: $('#myForm').serialize(),
				dataType: 'JSON',
				success: function(data) {
					if (data['result'] == 'username is not exist') {
						alert('用户名' + data['username'] + '不存在');
					} else {
						if (data['result'] == 'success') {
							alert('恭喜您，登陆成功！');
							window.location.href = 'http://localhost:63342/WWW/lr3181/works.html';
						} else {
							alert('用户名或密码错误!');
						}
					}
				},
				error: function(err) {
					console.log(err);
					alert('请求失败');
				}
			});
		});
	</script>
</html>
